<template>
    <BasePage>
        <el-form slot="form" :inline="true" size="medium" @submit.native.prevent>
            <el-form-item label="标题">
                <el-input v-model.trim="form.title" clearable placeholder="请输入" @keyup.enter.native="handleFilter" />
            </el-form-item>
            <el-form-item>
                <BaseButton v-permission="{ btnCode: 'dlyh_c17_d90_2' }" @click="handleFilter">查询</BaseButton>
            </el-form-item>
        </el-form>

        <div slot="button">
            <BaseButton v-permission="{ btnCode: 'dlyh_c17_d92_2' }" @click="handleAdd()">新增内容</BaseButton>
        </div>

        <!--数据列表区-->
        <BaseTable slot="table" v-loading="loading" :columns="columns" :data="list" height="calc(100% - 73px)" highlight-current-row>
            <template #number="{ scope: { row } }">
                <BaseButton type="text" @click="handleDetail(row.id)">{{ row.number }}</BaseButton>
            </template>
            <template #handle="{ scope: { row } }">
                <BaseButton v-show="row.level !== 3" v-permission="{ btnCode: 'dlyh_c17_d93_2' }" type="text" @click="handleEdit(row.id)">编辑</BaseButton>
                <BaseButton v-permission="{ btnCode: 'dlyh_c17_d94_2' }" type="text" color="danger" @click="handleDelete(row.id)">删除</BaseButton>
            </template>
        </BaseTable>
        <!--分页组件-->
        <Pagination
            slot="pagination"
            :current-page.sync="page.pageNo"
            :page-size.sync="page.pageSize"
            :total="page.total"
            @current-change="getList"
            @size-change="getList"
        />
    </BasePage>
</template>

<script>
import BasePage from '@/layouts/BasePage'
import { StandartModel } from '@/models'
import reconfirm from '@/utils/reconfirm'

export default {
    name: 'StandardList',
    components: {
        BasePage
    },
    data() {
        return {
            model: new StandartModel(),
            loading: true,
            form: {},
            list: [],
            page: {
                pageNo: 1,
                pageSize: 10,
                total: 0
            },
            columns: Object.freeze([
                {
                    slot: 'number',
                    attrs: {
                        prop: 'number',
                        label: '编号',
                        width: '160',
                        'show-overflow-tooltip': true
                    }
                },
                {
                    attrs: {
                        prop: 'title',
                        label: '标题',
                        width: '230',
                        'show-overflow-tooltip': true
                    }
                },
                {
                    attrs: {
                        prop: 'constructRange',
                        label: '作业范围',
                        width: '160',
                        'show-overflow-tooltip': true
                    }
                },
                {
                    attrs: {
                        prop: 'object',
                        label: '实施对象',
                        width: '160',
                        'show-overflow-tooltip': true
                    }
                },
                {
                    attrs: {
                        prop: 'content',
                        label: '内容',
                        'min-width': '200',
                        'show-overflow-tooltip': true
                    }
                },
                {
                    slot: 'handle',
                    attrs: {
                        label: '操作',
                        width: '180',
                        fixed: 'right'
                    }
                }
            ])
        }
    },
    created() {
        this.getList()
    },
    methods: {
        getList() {
            this.loading = true
            this.model
                .getList(this.form, this.page)
                .then((res) => {
                    this.list = res.list
                    this.page.total = res.totalCount
                })
                .finally(() => {
                    this.loading = false
                })
        },
        // 查询
        handleFilter() {
            this.page.pageNo = 1
            this.getList()
        },
        handleAdd() {
            this.$router.push({ path: 'add', query: { type: 'add' } })
        },
        handleEdit(id) {
            this.$router.push({ path: 'edit', query: { type: 'edit', id } })
        },
        handleDelete(id) {
            reconfirm({
                callback: () => this.delete(id)
            })
        },
        delete(id) {
            return this.model.delete({ id }).then(() => {
                this.getList()
                this.$message.success('删除成功!')
            })
        },
        handleDetail(id) {
            this.$router.push({ path: 'detail', query: { id } })
        },
        handleSubmit(valid) {
            if (valid) {
                // 弹框添加的是一级机构，默认parentId为0，level为1
                const data = { ...this.dialogForm, parentId: this.parentId, level: this.level }
                console.log(data)
                this.model.saveOrUpdate(data).then(() => {
                    this.dialogVisible = false
                    this.page.pageNo = 1
                    this.getList()
                    this.$message.success('新建成功！')
                })
            }
        }
    }
}
</script>

<style lang="scss" scoped>
</style>
